<template>
	<div>
		<van-row style="height: 3vh;margin-top: 3vh;">
			<van-col style="margin-left: 0.625rem;line-height: 0.625rem;font-weight: 600;font-size: 15px;">
				新品上市
			</van-col>
		</van-row>
		<van-row style="margin-top: 1vh;overflow-x: scroll;" class="none">
			<van-col style="display: flex;flex-wrap: nowrap;">
				<van-row style="width: 60vw;height: 50vh;border: 1px solid #ccc;margin-left: 10px;border-radius: 10px;" v-for="(item,index) in leftreac_list">
					<van-col span="24" >
						<van-row style="height: 30vh;">
							<van-image
							  width="100%"
							  height="100%"
							  :lazy-load="true"
							  :src="http+item.original_img"
							/>
						</van-row>
						<van-row style="height: 7vh;margin-left: 0.5rem;">
							<van-col span="24" >
								<h3 style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;line-height: 6vh;text-align: center;">{{item.goods_name}}</h3>
							</van-col>
						</van-row>
						<van-row style="margin-left: 0.5rem; text-align: center; height: 6vh;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;">
							{{item.goods_name}}
						</van-row>
						<van-row style="height: 4vh;margin-left: 0.5rem;line-height: 6vh;">
							<h2 style="color: #FF0000;"><span style="font-size: 16px;">￥</span> {{item.market_price}}</h2>
						</van-row>
					</van-col>
				</van-row>
			</van-col>
		</van-row>
		
	</div>
</template>

<script>
	import { mapGetters } from 'vuex'
	export default {
		
		data() {
			return {
				http:'https://img.9lele.com',
				leftreac_list:[]
			};
		},
		computed: {
		  ...mapGetters([
		  'leftreact'
		  ])
		},
		created() {
			this.$nextTick(function(){
			  this.$store.dispatch("user/vuexLeft",'牛')
			  .then(e=>{
			  		console.log(e)
					this.leftreac_list = e.data.data
			  })
			})
		},
		methods: {
			
		}
	
	};
</script>

<style>
	.none::-webkit-scrollbar{
		display: none;
	}
</style>
